<template>
  <div class="image-container">
    <el-image style="height: 500px" :src="notfoundImageUrl" fit="cover" />
  </div>
</template>

<script lang="ts" setup>
let notfoundImageUrl =
  "/src/assets/" + process.env.VITE_THEME_NAME + "/images/404/404-2.png";
</script>
<style lang="less" scoped>
.image-container {
  width: 100%; /* 宽度继承自父容器 */
  height: 100%; /* 高度也继承自父容器 */
  display: flex; /* 同样使用Flexbox确保el-image可以填充整个空间 */
  justify-content: center; /* 如果你想让图片在水平方向上居中（尽管fit="cover"可能会覆盖这个效果） */
  align-items: center; /* 在这里不是必需的，因为我们想让图片填充整个容器 */
}
</style>